<template>
	<view class="container">
	    <!-- 工单列表 -->
	    <view v-for="(item, index) in orderData" :key="index" class="order-item">
	      <!-- 工单图片 -->
		  <image class="order-image" :src="baseUrl + item.image" ></image>
	      
	      <!-- 工单信息 -->
	      <view class="order-info">
	        <text class="info-text">问题描述：{{ item.orderDesc }}</text>
	        <text class="info-text">工单状态：{{ statusMap[item.orderStatus] }}</text>
	        <text class="info-text">优先级：{{ priorityMap[item.priority] }}</text>
	      </view>
	
	      <!-- 操作按钮 -->
	      <view class="action-buttons">
	        <button class="btn accept" @click="handleAccept(item.id)" >接单</button>
	        <button class="btn cancel" @click="handleCancel(item.id)" >拒单</button>
	      </view>
	    </view>
	  </view>
</template>

<script>
import { getWorkerOrder, editWorkerOrder } from "@/api/workerOrder.js"

export default {
  data() {
    return {
		orderData: [] ,
		baseUrl: "http://localhost:8080",
		statusMap: {
	          0: '待派单',
	          1: '待接单',
	          2: '待维修',
			  4: '已完成',
	          5: '已关闭'
	        },
		priorityMap: {
	          1: '高',
	          2: '中',
	          3: '低'
	        }
    };
  },
  
  onLoad(options) {
    this.fetchOrderData(100);
  },
  
  methods: {
    fetchOrderData(workerId) {
		getWorkerOrder(workerId).then(response => {
		    this.orderData = response.data;
		}).catch(error => {
		    console.error('获取工单数据失败:', error);
		});
	},
	reset(){
		this.orderData = {};
	},
	handleAccept(orderId) {
	    uni.showModal({
	        title: '确认接单',
	        content: '确定要接受这个工单吗？',
	        success: (res) => {
	          if (res.confirm) {
				editWorkerOrder(orderId,2).then(()=>{
					this.$tab.redirectTo('/pages/OrderDetail/OrderDetail');
					getWorkerOrder(100);
				});
	          }
	        }
	    });
	},
	handleCancel(orderId) {
	    uni.showModal({
			title: '确认拒单',
			content: '确定要拒绝这个工单吗？',
			success: (res) => {
				if (res.confirm) {
					editWorkerOrder(orderId,1).then(()=>{
						this.$tab.redirectTo('/pages/OrderDetail/OrderDetail');
						getWorkerOrder(100);
					});
				}
			}
	    });
	}
  }
};
</script>

<style>
	.container {
  padding: 20rpx;
}

.order-item {
  background: #fff;
  border-radius: 16rpx;
  margin-bottom: 20rpx;
  padding: 20rpx;
  box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.1);
}

.order-image {
  width: 100%;
  height: 400rpx;
  border-radius: 8rpx;
  margin-bottom: 20rpx;
}

.order-info {
  margin-bottom: 20rpx;
}

.info-text {
  display: block;
  font-size: 30rpx;
  color: #2c3e50;
  margin-bottom: 24rpx;
  position: relative;
  padding-left: 40rpx;
  line-height: 1.5;
}

.info-text::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 8rpx;
  height: 8rpx;
  background: #007AFF;
  border-radius: 50%;
}

.action-buttons {
  display: flex;
  justify-content: space-between;
}

.btn {
  flex: 1;
  font-size: 28rpx;
  border-radius: 8rpx;
  padding: 12rpx 0;
}

.accept {
  background: #4CAF50;
  color: white;
  margin-right: 20rpx;
}

.cancel {
  background: #F44336;
  color: white;
}
</style>
